import React,{useEffect, useState,useRef} from "react"
import {notification} from 'antd'
const withGetAndReset = (Component,pageUrl,formData,getUrl) => {

  return function WithGetAndResetComponent(props) {
    

   //分页数据
   console.log(props);
    const [pagination,setPagination] = useState({ current:1,pageSize:10})
    const time = useRef()
    const {form} = props
    const [loading,setLoading] = useState(false)

    // 获取缓存的数据
    useEffect(()=>{
      form.setFieldsValue(props.tabList.filter(i=>i.pageUrl===pageUrl)[0].data?.form)
      setPagination(props.tabList.filter(i=>i.pageUrl===pageUrl)[0].data?.pagination||{
        current:1,
        pageSize:10
      })
      },[]) // eslint-disable-line react-hooks/exhaustive-deps
    
    // 1.获取数据
    const getNewList=(value)=>{
      // loading开启
      setLoading(true)
      // 缓存数据
      const data = {
        pagination: value&&value.pageSize?value:pagination,
        form:form.getFieldValue()
      }
      props.setPageDataFn(pageUrl,data) 
      // 请求数据  请求地址 getUrl 请求数据 formData
      time.current = setTimeout(()=>{
        setLoading(false)
        notification.success({
          message: '查询成功',
          duration:1
        });
       },500)
       return ()=>{
         clearTimeout(time.current)
       }
    }

    // 2.重置表单
    const resetForm= () => {
      form.resetFields()
      setPagination({
        current:1,
        pageSize:10
      })
      getNewList()
    }


      return <Component {...props} resetForm={resetForm} loading={loading} setLoading={setLoading} getNewList={getNewList} setPagination={setPagination} pagination={pagination}/>
  }

}

export default withGetAndReset